<style scoped lang="less">
  @import "subject";
</style>
<template>
  <div class="subject-container">
    <div class="subject-title">{{subject.title}}</div>
    <div class="subject-banner">
      <van-image :src="GLOBAL.getUrl(subject.img!=null?subject.img[0]:subject.oriimg[0])" lazy-load></van-image>
    </div>
	  <GoodsItems :list="list"></GoodsItems>
<!--    <div class="q-subject-item-wrap">-->
<!--      <div @click="jump(item.goods_id)" class="q-subject-item" v-for="(item,index) in list" :key="index">-->
<!--        <van-image :src="GLOBAL.getUrl(item.banner!=null?item.banner[0]:'')" lazy-load></van-image>-->
<!--        <div class="q-subject-item-title">{{item.title}}</div>-->
<!--        <div class="q-subject-item-discount">-->
<!--          {{(item.vip_discount===null||item.vip_discount===0)?' ':'会员优惠:'+item.vip_discount/100+'元'}}-->
<!--        </div>-->
<!--        <div class="q-subject-item-info">-->
<!--          <span class="q-subject-item-price"><span class="q-subject-item-symbol">￥</span>{{item.price/100}}</span>-->
<!--          <span class="q-subject-item-sales">{{item.sales>0?'已售'+item.sales:''}}</span>-->
<!--        </div>-->
<!--      </div>-->
<!--    </div>-->
    <div class="q-subject-item-show-more" v-if="count>list.length">查看更多</div>
  </div>
</template>
<script>
  import {actionDis} from "../../../libs/action-tools";
  import GoodsItems from "../../goods/GoodsItems";
  import {getList} from '@/api/subject';
  import Vue from 'vue';
  import {Image} from 'vant';

  Vue.use(Image);
  export default {
    name: 'q-subject',
    data() {
      return {
        list: [],
        count: 0
      };
    },
	  components:{
      GoodsItems
	  },
    props: {
      subject: {
        type: Object,
        default: function () {
          return {type: this.GLOBAL.TYPE_LINK_SUBJECT, img: [''], title: '专题名', value: null};
        }
      },
    },
    watch: {
      subject: {
        immediate: true,
        handler(data) {
          if (this.subject.value !== null) {
            this.getList();
          }
        }
      }
    },
    methods: {
      jump(goods_id) {
        actionDis({type:this.GLOBAL.TYPE_LINK_ACTIVE,value:goods_id}, this)
      },
      more(){
        this.$router.push({name:'subject',params:{sub_id:this.subject.value}})
      },
      getList() {
        let vm = this;
        getList({page: 1, size: 4, sub_id: this.subject.value}).then(rep => {
          rep.data.data.list.forEach(v => {
            if (v.banner != null) {
              v.banner = JSON.parse(v.banner);
            }
          });
          vm.count = rep.data.data.count;
          vm.list = rep.data.data.list;
        });
      }
    }
  }
</script>
